{extend name="common/base_page" /}

{block name="title"}人员管理{/block}

{block name="jscssfile"}
<script>
var yzmUrl = "{:url('index/index/captcha')}?soure=addadmin&key={$captcha_key}", _captchaKey = '{$captcha_key}', _sTimer = null, _t = 60;
</script>
{/block}

{block name="css"}
<style type="text/css">
.layui-form-radio {margin: 6px 0px 0px 0px;}
</style>
{/block}

{block name="body"}
<div class="layui-fluid">
    <div class="layui-card">
      <div class="layui-card-header layuiadmin-card-header-auto" style="padding-bottom:0;">
        <form class="layui-form" action="" id="info-form" lay-filter="info-form" onsubmit="return false;">
        <div class="layui-form-item">
          <div class="layui-inline">
            <label class="layui-form-label">角色筛选</label>
            <div class="layui-input-inline">
              <select name="group_id" lay-filter="group_id">
                <option value="ALL">所有角色</option>
                {volist name="group_list" id="vo"}
                <option value="{$vo.id}">{$vo.name}</option>
                {/volist}
              </select>
            </div>
          </div>
          <div class="layui-inline">
            <label class="layui-form-label">账号状态</label>
            <div class="layui-input-inline">
              <select id="status" lay-filter="status">
                <option value="ALL">所有</option>
                <option value="0">停用</option>
                <option value="1">正常</option>
              </select>
            </div>
          </div>
          <div class="layui-inline">
            <label class="layui-form-label">关键词</label>
            <div class="layui-input-inline">
              <input type="text" id="keyword" placeholder="账号/名称/手机号" maxlength="15" autocomplete="off" class="layui-input">
            </div>
          </div>
          <div class="layui-inline">
            <button class="layui-btn layui-btn-normal" onclick="_p = 1;_loadList();">
              <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
            </button>
          </div>
        </div>
      </form>
        <a class="layui-btn layui-btn-normal" onclick="_addAction();" style="position: absolute;right:20px;top:20px;">添加</a>
      </div>
      <div class="layui-card-body" style="padding-top:0;">

        <table id="LAY-app-content-comm" lay-filter="LAY-app-content-comm"></table>

        <script type="text/html" id="statusTpl">
          {{#  if(d.status){ }}
            <button class="layui-btn layui-btn-xs">已启用</button>
          {{#  } else { }}
            <button class="layui-btn layui-btn-primary layui-btn-xs">已停用</button>
          {{#  } }}
        </script>
        <script type="text/html" id="table-content-com">
          <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
          <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
        </script>
      </div>
    </div>
</div>
{/block}

{block name="script"}
{include file="js_template/tpl_add_admin" /}
<script src="__INDEX__/js/clinic/admin.js?v={$site.version}"></script>
<script type="text/javascript">
var _p = 1, _groupId = 'ALL', _status = 'ALL';
$(function(){
  setTimeout(function(){
    layform.on('select(group_id)', function(_tv){
      if(_tv.value != _groupId)
      {
          _p = 1;
          _groupId = _tv.value;
          _loadList();
      }
    });
    layform.on('select(status)', function(_tv){
      if(_tv.value != _status)
      {
          _p = 1;
          _status = _tv.value;
          _loadList();
      }
    });
    layform.render();
    _loadList();
  },100);
});
//加载数据
function _loadList()
{
  __showLoadingBox('请稍候...');
  laytable.render({
      elem: '#LAY-app-content-comm'//指定表格元素
      ,url:"{:url('index/clinic.admin/index')}"
      ,method:'post'  //提交方式
      ,where:{keyword:$.trim($('#keyword').val()),page:_p,group_id:_groupId,status:_status} //post json数据
      ,page: {layout: ['count', 'prev', 'page', 'next', 'skip'],first: true,last: true}
      //,height: 'full-50'
      ,skin: 'line '  //表格风格 line （行边框风格）row （列边框风格）nob （无边框风格）
    　,even: true    //隔行换色
      ,limit: 20     //每页默认显示的数量
      ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
      ,height: 'full-100' //表格高度，layui 2.2.1 新增 , full-100 为适应最大高度或其它数值500
      ,cols: getTableConfigField()
      ,done:function(datalist,curr,page){
          __hideLoadingBox();
      }
  });

  laytable.on('tool(LAY-app-content-comm)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
      var _data = obj.data; //获得当前行数据
      var _event = obj.event; //获得 lay-event 对应的值
      if(_event === 'edit'){ //编辑
          window.location.href = "{:url('index/clinic.admin/info')}?id=" + _data.id;
      }
      if(_event === 'del'){ //删除
        layer.confirm('您确定要删除本条数据吗？', {
            title:'删除',shade:[0.4,'#000000'],btn: ['确定','取消'] //按钮
        }, function(){
            layer.closeAll();
            _Index.ajax("{:url('index/clinic.admin/del')}",{id:_data.id},function(d){
                if(d.err == 0)
                {
                  obj.del();
                  layer.msg(d.msg, {time: 1000},function(){
                      laytable.reload('LAY-app-content-comm');
                  });
                }else{
                  layer.msg(d.msg, {time: 2000,anim: 4});
                }
            },'请稍候...');
        });
      }
  });
}
//设置验证码
function _setNewCaptcha()
{
  $('.captcha-div img').attr('src',yzmUrl + '&t=' + Math.random());
  $("#tpl_addadmin_form :input[name='captcha_code']").val('');
}
//向手机号发送验证码
function _setSendCode()
{
  var _issend = $('.tel-codebtn').data('issend');
  if(_issend == true)
  {
    layer.msg('验证码已发送，请注意查收', {time: 2000,anim: 4});
    return false;
  }
  var param = {
    captcha_key:'{$captcha_key}',
    tel:$.trim($("#tpl_addadmin_form :input[name='user_mobile']").val()),
    captcha:$.trim($("#tpl_addadmin_form :input[name='captcha_code']").val()),
  };
  if(!_Index.checkPhone(param.tel))
  {
    $("#tpl_addadmin_form :input[name='user_mobile']").val('');
    $("#tpl_addadmin_form :input[name='user_mobile']").focus();
    layer.msg('您的手机号码格式不正确', {time: 2000,anim: 4});
    return false;
  }
  if(param.captcha == '' || param.captcha.length <= 0)
  {
    layer.msg('请输入图形验证码', {time: 2000,anim: 4});
    return false;
  }
  _Index.ajax("{:url('index/index/send_phone_verify')}",param,function(d){
    if(d.err == 0)
    {
      $('.tel-codebtn').data('issend','true');
      layer.msg(d.msg, {time: 2500});
      _sTimer = setInterval(function(){
        if(parseInt(_t) < 0)
        {
          _t = 60;
          //重新 设置验证码
          _setNewCaptcha();
          $('.tel-codebtn').data('issend','false');
          $('.tel-codebtn').html('点击发送');
          clearInterval(_sTimer);
        }else{
          $('.tel-codebtn').html(_t + '秒');
          _t--;
        }
      },1000);
      //重新 设置验证码
      _setNewCaptcha();
    }else{
      //重新 设置验证码
      _setNewCaptcha();
      layer.msg(d.msg, {time: 2000,anim: 4});
    }
  },'正在发送');
}
</script>
{/block}